<template>
	<view class="wap">
		<navbar :parameter='parameter'></navbar>
		<view class="list" v-if="evaluate_list.length > 0">
			<block v-for="(item,index) in evaluate_list " :key="index">
				<view class="list-item">
					<view class="acea-row row-between-wrapper">
						<view class="acea-row row-middle">
							<image class="header" :src="imageUrl+item.head_image" mode=""></image>
							<view class="">
								<view class="title"> {{item.staff_name}} </view>
								<view class="time">{{item.createtime}}</view>
							</view>
						</view>
						<u-rate :value="item.comprehensive_score" readonly activeColor="#FFA731"
							inactiveColor="#EDEDEC"></u-rate>
					</view>
					<view class="product_name">订单名称：{{item.product_name}} </view>
					<view class="cont-box">
						<view class="tit"> 评价内容： </view>
						<view class="cont line2"> {{item.content}} </view>
					</view>
				</view>
			</block>

		</view>
		<u-empty mode="message" icon="http://cdn.uviewui.com/uview/empty/list.png" text="暂无评价" v-else></u-empty>
		<u-loadmore :status="status" line dashed @loadmore="loadmore" v-if="evaluate_list.length > 0" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				parameter: {
					'navbar': '1',
					'return': '1',
					'title': '评价列表',
					'color': true,
					'class': 'on'
				},
				imageUrl: this.imageUrl,
				evaluate_list: [],
				show: false,
				status: 'loadmore',
				limit: 10,
				page: 1,
				total_num: '',
			};
		},
		onLoad() {
			this.list(1);
		},
		onShow() {

		},
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {
		
		},
		onShareTimeline(res) { //分享到朋友圈
		
		},
		onReachBottom() {
			this.loadmore()
		},
		methods: {
			confirm() {
				this.show = false;
			},
			async list(page) {
				const res = await this.$myRequest({
					url: '/api/user/getEvaluateList',
					data: {
						openid: uni.getStorageSync('openid'),
						page: page,
						limit: this.limit
					}
				})
				this.evaluate_list = [...this.evaluate_list, ...res.data.data];
				this.total_num = res.data.total_num;
			},
			loadmore() {
				console.log(11111)
				if (this.total_num == this.evaluate_list.length) {
					this.status = 'nomore';
				} else {
					this.status = 'loading';
					this.page++;
					this.list(this.page);
				}
				setTimeout(() => {
					if (this.total_num == this.evaluate_list.length) this.status = 'nomore';
					else this.status = 'loading';
				}, 2000)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.wap {
		padding: 30rpx;
	}

	.list {
		padding: 0 30rpx;
		background-color: #fff;
		border-radius: 12rpx;
	}

	.list-item {
		padding: 30rpx 0;
		background-color: #fff;
		border-bottom: 1px solid #D9D9DA;
	}

	.list-item:last-of-type {
		border-bottom: none;
	}

	.list-item .header {
		width: 100rpx;
		height: 100rpx;
		border-radius: 50%;
		margin-right: 20rpx;
	}

	.list-item .title {
		font-size: 28rpx;
		font-weight: 700;
		color: #000;
		margin-bottom: 10rpx;
	}
	.list-item .product_name{
		padding: 10rpx 0;
	}
	.list-item .cont-box .tit{
		font-size: 26rpx;
		color: #666;
	}

	.list-item .cont {
		font-size: 24rpx;
		color: #999999;
		line-height: 1.8;
		margin-bottom: 10rpx;
	}

	.list-item .time {
		font-size: 24rpx;
		color: #999999;
	}
</style>
